import 'package:ai/AppRouter.gr.dart';
import 'package:ai/entity/device_info.dart';
import 'package:ai/response/HomeResponse.dart';
import 'package:ai/service/HomeService.dart';
import 'package:auto_route/auto_route.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';

import '../components/Loading.dart';
import '../config/Config.dart';
import '../util/CommonUtils.dart';

@RoutePage()
class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final HomeService homeService = HomeService();

  late Data data = Data.init();

  late bool loading = false;

  @override
  void initState() {
    super.initState();
    setState(() {
      loading = true;
    });
    homeService.init().then((result) {
      setState(() {
        data = result;
        loading = false;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    var devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
    DeviceInfo.devicePixelRatio = devicePixelRatio;
    DeviceInfo.height = size.height*devicePixelRatio;
    DeviceInfo.width = size.width*devicePixelRatio;
    return CustomScrollView(
      slivers: List.generate(
        1 + data.apps.length,
        (index) {
          if (index == 0) {
            return SliverToBoxAdapter(
              child: Stack(
                children: [
                  Container(
                    alignment: Alignment.topCenter,
                    height: 898*(DeviceInfo.width/1242)/DeviceInfo.devicePixelRatio+80,
                    child: Image.asset(
                      "asset/images/bg_home.png",
                      width: DeviceInfo.width,
                    ),
                  ),
                  Positioned(
                    bottom: 0,
                    left: 0,
                    right: 0,
                    child: Row(
                      children: [
                        const SizedBox(
                          width: 8,
                        ),
                        Expanded(
                          child: CommonUtils.getImageAsset(
                            "icon_creater",
                          ),
                        ),
                        const SizedBox(
                          width: 8,
                        ),
                        Expanded(
                          child: Column(
                            children: [
                              CommonUtils.getImageAsset(
                                "icon_original",
                              ),
                              const SizedBox(
                                height: 8,
                              ),
                              CommonUtils.getImageAsset(
                                "icon_copy_extraction",
                              ),
                            ],
                          ),
                        ),
                        const SizedBox(
                          width: 8,
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            );
          }
          return getList();
        },
      ),
    );
  }

  getList() {
    var app = data.apps[0];
    return SliverToBoxAdapter(
      child: ListView(
        shrinkWrap: true,
        physics: const NeverScrollableScrollPhysics(),
        children: [
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 16),
            child: Text(
              app.title,
              style: TextStyle(
                fontWeight: FontWeight.bold,
                fontSize: 18,
                color: Config.color3,
              ),
            ),
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
            child: GridView.builder(
              gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: 3,
              ),
              itemCount: app.list.length,
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              itemBuilder: (context, index) {
                return GestureDetector(
                  onTap: () {
                    context.router
                        .push(TextCreateRoute(appId: app.list[index].id));
                  },
                  child: Column(
                    children: [
                      CachedNetworkImage(
                        placeholder: (context, url) => const Loading(),
                        imageUrl: app.list[index].icon,
                        width: 48,
                      ),
                      const SizedBox(
                        height: 4,
                      ),
                      Text(
                        app.list[index].name,
                        style: TextStyle(
                          color: Config.color43,
                          fontSize: 14
                        ),
                      ),
                    ],
                  ),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}
